<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Prosessing Clock - control.table.js</title>
		<meta name="keywords" content="Prosessing,Clock,Adobe AIR,Ajax/HTML,Mootools,ProsessingAS" />
		<meta name="description" content="Prosessing Clock - Adode AIR Application" />
		<meta http-equiv="Content-Language" content="ja" />
		<meta http-equiv="Content-Script-Type" content="text/javascript" />
		<meta http-equiv="Content-Style-Type" content="text/css" />
		<link rel="stylesheet" type="text/css" href="../share/styles/reset.css" />
		<link rel="stylesheet" type="text/css" href="../share/styles/common.css" />
		<script type="text/javascript" src="../libraries/mootools/mootools-1.2.3-core.js"></script>
		<script type="text/javascript" src="../libraries/mootools/mootools-1.2.3.1-more.js"></script>
		<script type="text/javascript" src="../scripts/control/control.combobox.js"></script>
		<script type="text/javascript">
			window.addEvent("domready", function() {


				var hours = ["00","01","02","03"];
				var selectElement = new Element("select");
				hours.each(function(v,k){
					var optionElement = new Element("option", {"html": v, "value": v});
					optionElement.inject(selectElement);
				});
				selectElement.inject($("time1"));
				var no1 = new Control.Combobox(selectElement);

				var text = document.createTextNode(" : ");
				$("time1").appendChild(text);

				var minutes = ["00","01","02","03","04","00","01","02","03","04","00","01","02","03","04","00","01","02","03","99"];
				var selectElement = new Element("select");
				minutes.each(function(v,k){
					var optionElement = new Element("option", {"html": v, "value": v});
					optionElement.inject(selectElement);
				});
				selectElement.inject($("time1"));
				var no2 = new Control.Combobox(selectElement);


				$("no1").addEvent("click", function(){
					alert(no1.getValue());
				});

			});
		</script>
	</head>
	<body>
		<div id="warpper">
			<table class="control">
				<tr>
					<th>time</th>
				</tr>
				<tr>
					<td id="time1">&nbsp;</td>
				</tr>
				<tr>
					<td>
						<select name="hoge">
							<option value="01">01</option>
							<option value="02">02</option>
							<option value="03">03</option>
							<option value="04">04</option>
							<option value="05">05</option>
							<option value="06">06</option>
							<option value="07">07</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
						</select>
					</td>
				</tr>
				<tr>
					<th>time</th>
				</tr>
				<tr>
					<td id="time2">&nbsp;</td>
				</tr>
				<tr>
					<td>
						<select name="hoge">
							<option value="01">01</option>
							<option value="02">02</option>
							<option value="03">03</option>
							<option value="04">04</option>
							<option value="05">05</option>
							<option value="06">06</option>
							<option value="07">07</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
						</select>
					</td>
				</tr>
				<tr>
					<th>time</th>
				</tr>
				<tr>
					<td id="time3">&nbsp;</td>
				</tr>
				<tr>
					<td>
						<select name="hoge">
							<option value="01">01</option>
							<option value="02">02</option>
							<option value="03">03</option>
							<option value="04">04</option>
							<option value="05">05</option>
							<option value="06">06</option>
							<option value="07">07</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
							<option value="08">08</option>
						</select>
					</td>
				</tr>
			</table>
			<p><a id="no1" href="#">no1</a></p>
		</div>
	</body>
</html>